<template>
  <el-card class="user-profile">
    <div slot="header">
      <span class="user-profile-header">🚧个人中心</span>
    </div>

    <el-collapse v-model="activeNames">
      <el-collapse-item title="基础信息" name="1">
        <BaseInfo />
      </el-collapse-item>
      <el-collapse-item title="施工中" name="2">
        <h4>施工中</h4>
      </el-collapse-item>
      <el-collapse-item title="施工中" name="3">
        <h4>施工中</h4>
      </el-collapse-item>
      <el-collapse-item title="施工中" name="4">
        <h4>施工中</h4>
      </el-collapse-item>
    </el-collapse>
  </el-card>
</template>

<script>
import { mapGetters } from "vuex";
import BaseInfo from "@/components/userProfile/BaseInfo";
export default {
  components: {
    BaseInfo
  },
  data() {
    return {
      activeNames: ["1"]
    };
  },
  created() {

  },
  computed: {
    ...mapGetters([
      "profile"
    ])
  }
};
</script>

<style lang="scss">
.user-profile {
  width: 100%;
  max-width: 1280px;
  margin: 0 auto;
  border: none;
  .user-profile-header {
    font-size: 1.2em;
    font-weight: bold;
  }
}
</style>

